<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<title>CSS 文本圆形环绕</title>
</head>
<style type="text/css">
	*{
		margin: 0;
		padding: 0;
	}
	.wapper{
		width: 500px;
		height: 300px;
		border: 1px solid red;
		margin: 100px auto;
	}
	.wapper div{
		width: 100px;
		height: 100px;
		border-radius: 50%;
		background-color: red;
		float: left;
		shape-outside: circle();
		margin-right: 10px;
	}
</style>
<body>
	<div class="wapper">
		<div></div>
		wenben wenben wenben wenben wenben
		wenben wenben wenben wenben wenben
		wenben wenben wenben wenben wenben
		wenben wenben wenben wenben wenben
		wenben wenben wenben wenben wenben
		wenben wenben wenben wenben wenben
		wenben wenben wenben wenben wenben
		wenben wenben wenben wenben wenben
		wenben wenben wenben wenben wenben
		wenben wenben wenben wenben wenben
	</div>
</body>
</html>